import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    // 课程
    curriculum:[
      {
        id:1,
        title:'Vue课程',
        ftitle:'零基础学习     Vue.j课程',
        image:require('../assets/vue.png'),
        present:'Vue (发音为 /vjuː/，类似 view) 是一款用于构建用户界面的 JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript 构建，并提供了一套声明式的、组件化的编程模型，帮助你高效地开发用户界面。无论是简单还是复杂的界面，Vue 都可以胜任。',
        people:'前端开发工程师 ,前端爱好者',
        decs:'Vue 的组件可以按两种不同的风格书写：选项式 API 和组合式 API',
        collect:false,
        time:'12'
      },
      {
        id:2,
        title:'鸿蒙课程',
        ftitle:'零基础学习     鸿蒙课程',
        image:require('../assets/harmonyOS.png'),
        present:'Vue (发音为 /vjuː/，类似 view) 是一款用于构建用户界面的 JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript 构建，并提供了一套声明式的、组件化的编程模型，帮助你高效地开发用户界面。无论是简单还是复杂的界面，Vue 都可以胜任。',
        people:'鸿蒙系统开发工程师 ,鸿蒙系统爱好者',
        decs:'鸿蒙系统 的组件可以按两种不同的风格书写：选项式 API 和组合式 API',
        collect:false,
        time:'23'

      },
      {
        id:3,
        title:'React课程',
        ftitle:'零基础学习     React课程',
        image:require('../assets/react.png'),
        present:'Vue (发音为 /vjuː/，类似 view) 是一款用于构建用户界面的 JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript 构建，并提供了一套声明式的、组件化的编程模型，帮助你高效地开发用户界面。无论是简单还是复杂的界面，Vue 都可以胜任。',
        people:'前端开发工程师 ,前端爱好者',
        decs:'React 的组件可以按两种不同的风格书写：选项式 API 和组合式 API',
        collect:false,
        time:'50'
        
      },
      {
        id:4,
        title:'JAVA课程',
        ftitle:'零基础学习     JAVA课程',
        image:require('../assets/java.jpg'),
        present:'Java 语言的语法与 C 语言和 C++ 语言很接近，使得大多数程序员很容易学习和使用。另一方面，Java 丢弃了 C++ 中很少使用的、很难理解的、令人迷惑的那些特性，如操作符重载、多继承、自动的强制类型转换。特别地，Java 语言不使用指针，而是引用。并提供了自动分配和回收内存空间，使得程序员不必为内存管理而担忧。',
        people:'后端开发工程师 ,后端爱好者',
        decs:'Java 语言的设计目标之一是适应于动态变化的环境。Java 程序需要的类能够动态地被载入到运行环境，也可以通过网络来载入所需要的类。这也有利于软件的升级。另外，Java 中的类有一个运行时刻的表示，能进行运行时刻的类型检查。',
        collect:false,
        time:'100'
        
      }
      
    ],
    details:{},
    // 收藏的课程
    collectionCurriculum:[],
    // 分类页标题
    fenleiTitle:''
  },
  getters: {
  },
  mutations: {
    // 保存用户信息
    setUserInof(state,value){
      console.log('data',value)
        state.userInfo = value
    },
    // 保存注册信息
    setRegister(state,value){
      console.log('保存注册信息',value)
      state.register = value
    },
    // 修改课程
    setCurriculum(state,value){
      let a = state.curriculum.find(item=>item.id==value.id)
      if(a){
        const index = state.curriculum.findIndex(item => item.id == a.id)
        if(index!=undefined){
          state.curriculum[index].collect = value.collect
          //收藏的课程
          const b = state.collectionCurriculum.find(item=>item.id==value.id)
          if(b){
            console.log('存在的课程')
            const index2 = state.collectionCurriculum.findIndex(item => item.id == a.id)
            // console.log(index2)
            state.collectionCurriculum.splice(index2,1)
            // console.log(state.collectionCurriculum[index2])

          }else{
            console.log('不存在的课程')
            state.collectionCurriculum.push(state.curriculum[index])
          }
        }
      }
    },
    setDetails(state,value){
      state.details = value
    },
    setFenleiTitle(state,value){
      state.fenleiTitle = value
    }
  },
  actions: {
    Details({commit},data){
      commit('setDetails',data)
    },
    Curriculum({commit},id){
      commit('setCurriculum',id)
    },
    fenleiTitle({commit},tit){
      commit('setFenleiTitle',tit)
    }
  },
  modules: {
  }
})
